fix(Channel): guard render-phase channel.getConfig() against disconnected channels by oliverlaz · Pull Request #3257 · GetStream/stream-chat-react

oliverlaz · 2026-08-05T11:54:21Z

🎯 Goal

ChannelInner called channel.getConfig() directly in the component body. That call throws You can't use a channel after client.disconnect() was called once the channel is disconnected — which happens when the current user is removed from a channel or the channel is deleted. The flag is flipped by an async WS event while <Channel> is still mounted, so the throw landed in the render phase and tore down the surrounding subtree.

Same failure class as #2393 and #3248.

🛠 Implementation details

Added an internal getChannelConfig(channel) helper that returns undefined for a disconnected channel instead of calling getConfig(), and applied it everywhere the config was read during render or in an effect:

Channel.tsx — the reported crash. Now also a lazy useState initializer, so the call no longer re-runs on every render.
AttachmentSelector.tsx and useMessageComposerCommands.ts
useMarkRead.ts

handleEvent in Channel.tsx also early-returns for a disconnected channel, and the composer skips draft creation on unmount.

loadMoreNewer picked up the channel.disconnected guard that loadMore already had — without it, scrolling to the bottom of a disconnected channel still queried a dead channel on every attempt (caught by the existing try/catch, so only log noise and a redundant dispatch).

Fixing Channel alone is not enough: the crash relocates to AttachmentSelector once ChannelInner stops throwing and its subtree starts rendering.

undefined is already part of getConfig()'s return type, so degradation is graceful — no read events, no commands, and the attachment selector renders nothing instead of crashing.

Overlaps with #3249, which adds the same if (messageComposer.channel.disconnected) return; line along with a more complete treatment of that effect (.catch() on createDraft(), a drafts-enabled check, and preventClearingOnUnmount). #3249 should own that effect — the line is kept here only so this PR stays independently mergeable. Whoever merges second should drop the duplicate.

9 tests added, each verified to fail against the unfixed code first.

🎨 UI Changes

None.

Summary by CodeRabbit

Bug Fixes
- Improved stability when channels disconnect.
- Prevented pagination, event handling, read receipts, attachment actions, and composer cleanup from triggering errors after disconnection.
- Preserved channel configuration safely across re-renders and user deletion scenarios.
Tests
- Added regression coverage for disconnected-channel behavior across messaging, composer, pagination, and read-state features.

…cted channels ChannelInner evaluated channel.getConfig() as an eager useState argument, which throws "You can't use a channel after client.disconnect() was called" once the channel is disconnected (current user removed / channel deleted). The throw happened during render, tearing down the surrounding subtree. Add an internal getChannelConfig() guard, apply it at every render-phase call site, use a lazy initializer so it no longer re-runs on every render, and early-return from handleEvent for a disconnected channel. Fixing Channel alone is not enough: the crash relocates to AttachmentSelector once ChannelInner stops throwing and its subtree renders. Closes #3254

coderabbitai · 2026-08-05T11:54:41Z

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

@coderabbitai resume to resume automatic reviews.
@coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

▶️ Resume reviews
🔍 Trigger review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 57e15088-7324-4e1b-96a6-dd8d717ea511

📥 Commits

Reviewing files that changed from the base of the PR and between 91d0e95 and eae6c2d.

📒 Files selected for processing (1)

src/components/Channel/__tests__/Channel.test.tsx

🚧 Files skipped from review as they are similar to previous changes (1)

src/components/Channel/tests/Channel.test.tsx

📝 Walkthrough

Walkthrough

The PR adds a shared disconnected-channel configuration guard. Channel rendering, events, and pagination avoid unsafe access. Composer and read-state flows skip operations that require an active client. Regression tests cover these paths.

Changes

Disconnected channel safety

Layer / File(s)	Summary
Safe channel configuration access `src/utils/getChannelConfig.ts`, `src/utils/__tests__/getChannelConfig.test.ts`	Adds `getChannelConfig`, which returns `undefined` for disconnected channels and otherwise calls `channel.getConfig()`.
Channel render and event guards `src/components/Channel/Channel.tsx`, `src/components/Channel/__tests__/Channel.test.tsx`	Uses the shared helper during initialization. Disconnected events and newer-message pagination return early. Tests cover rerenders, initial state, pagination, and event handling.
Composer and message-list guards `src/components/MessageComposer/...`, `src/components/MessageList/hooks/...`	Uses the shared helper for attachment actions, commands, and read-event support. Composer cleanup skips draft operations when disconnected. Tests cover each path.

Estimated code review effort: 3 (Moderate) | ~20 minutes

Suggested reviewers: arnautov-anton

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and concisely describes the primary fix for render-time getConfig calls on disconnected channels.
Description check	✅ Passed	The description includes the required Goal, Implementation details, and UI Changes sections with specific technical details and test coverage.
Linked Issues check	✅ Passed	The implementation satisfies issue `#3254` by guarding disconnected channels and using a lazy state initializer to prevent render-time crashes.
Out of Scope Changes check	✅ Passed	The code and regression tests remain related to disconnected-channel safety and do not introduce unrelated changes.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing Touches

📝 Generate docstrings

Create stacked PR
Commit on current branch

🧪 Generate unit tests (beta)

Create PR with unit tests
Commit unit tests in branch fix/disconnected-channel-getconfig

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands.}

github-actions · 2026-08-05T11:55:55Z

Size Change: +235 B (+0.03%)

Total Size: 885 kB

📦 View Changed

Filename	Size	Change
`dist/cjs/channel-detail.js`	23.3 kB	-2 B (-0.01%)
`dist/cjs/emojis.js`	2.65 kB	-2 B (-0.08%)
`dist/cjs/index.js`	293 kB	+25 B (+0.01%)
`dist/cjs/useChannelHeaderOnlineStatus.js`	41.2 kB	-1 B (0%)
`dist/cjs/useMessageComposerController.js`	1.01 kB	-2 B (-0.2%)
`dist/cjs/useNotificationApi.js`	58.1 kB	+114 B (+0.2%)
`dist/es/channel-detail.mjs`	22.7 kB	-6 B (-0.03%)
`dist/es/emojis.mjs`	2.58 kB	-1 B (-0.04%)
`dist/es/index.mjs`	290 kB	+6 B (0%)
`dist/es/useChannelHeaderOnlineStatus.mjs`	40.6 kB	-2 B (0%)
`dist/es/useNotificationApi.mjs`	56.8 kB	+106 B (+0.19%)

ℹ️ View Unchanged

Filename	Size
`dist/cjs/audioProcessing.js`	1.74 kB
`dist/cjs/mp3-encoder.js`	814 B
`dist/cjs/ReactPlayerWrapper.js`	546 B
`dist/css/channel-detail.css`	2.84 kB
`dist/css/emoji-picker.css`	178 B
`dist/css/emoji-replacement.css`	456 B
`dist/css/index.css`	41.4 kB
`dist/es/audioProcessing.mjs`	1.65 kB
`dist/es/mp3-encoder.mjs`	768 B
`dist/es/ReactPlayerWrapper.mjs`	485 B
`dist/es/useMessageComposerController.mjs`	936 B

_{compressed-size-action}

coderabbitai

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@src/components/MessageComposer/MessageComposer.tsx`:
- Around line 98-105: Recheck messageComposer.channel.disconnected inside the
finally callback before calling messageComposer.clear(), while preserving the
existing early return before createDraft(). Add a test covering an unresolved
createDraft(), unmounting and disconnecting the channel, then resolving the
draft and verifying clear() is not called.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

Push a commit to this branch (recommended)
Create a new PR with the fixes

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 8dfb987f-5afb-479d-a989-5f3fb44ef7e7

📥 Commits

Reviewing files that changed from the base of the PR and between 13b3f13 and 36d2a37.

📒 Files selected for processing (12)

src/components/Channel/Channel.tsx
src/components/Channel/__tests__/Channel.test.tsx
src/components/MessageComposer/AttachmentSelector/AttachmentSelector.tsx
src/components/MessageComposer/MessageComposer.tsx
src/components/MessageComposer/__tests__/AttachmentSelector.test.tsx
src/components/MessageComposer/__tests__/MessageInput.test.tsx
src/components/MessageComposer/hooks/__tests__/useMessageComposerCommands.test.tsx
src/components/MessageComposer/hooks/useMessageComposerCommands.ts
src/components/MessageList/hooks/__tests__/useMarkRead.test.tsx
src/components/MessageList/hooks/useMarkRead.ts
src/utils/__tests__/getChannelConfig.test.ts
src/utils/getChannelConfig.ts

codecov · 2026-08-05T11:59:11Z

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 85.26%. Comparing base (1b8fa34) to head (eae6c2d).
⚠️ Report is 2 commits behind head on master.

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #3257      +/-   ##
==========================================
+ Coverage   85.21%   85.26%   +0.05%     
==========================================
  Files         507      509       +2     
  Lines       15957    15972      +15     
  Branches     5029     5034       +5     
==========================================
+ Hits        13597    13618      +21     
+ Misses       2360     2354       -6

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

loadMore already short-circuits on channel.disconnected, but loadMoreNewer checked only online.current / navigator.onLine / hasNext and went on to call channel.query(), which throws for a disconnected channel. The existing try/catch swallowed it into a console.warn plus a spurious setLoadingMoreNewer dispatch on every scroll-to-bottom.

Reduce the getChannelConfig JSDoc and the inline comments to the core statement: what throws, when, and what is returned instead.

Experiment only, to be reverted. Keeps the loadMoreNewer production guard and removes only the test added alongside it, to determine whether the VirtualizedMessageList snapshot failure on CI comes from the guard itself or from the scheduling shift caused by one extra test.

Fold the loadMoreNewer assertion into the existing disconnected-pagination test instead of adding a separate one. The extra test entry shifted parallel test scheduling enough to tip a pre-existing race in the VirtualizedMessageList empty-list snapshot on CI, where react-virtuoso reported "not at bottom" and rendered the jump-to-latest button.

oliverlaz requested review from MartinCupela and arnautov-anton as code owners August 5, 2026 11:54

oliverlaz deployed to Vite Example Public (Preview) August 5, 2026 11:55 — with GitHub Actions View deployment

oliverlaz deployed to Vite Example Development (Preview) August 5, 2026 11:55 — with GitHub Actions View deployment

coderabbitai Bot reviewed Aug 5, 2026

View reviewed changes

Comment thread src/components/MessageComposer/MessageComposer.tsx Outdated

MartinCupela approved these changes Aug 5, 2026

View reviewed changes

oliverlaz deployed to Vite Example Development (Preview) August 5, 2026 15:37 — with GitHub Actions View deployment

oliverlaz deployed to Vite Example Public (Preview) August 5, 2026 15:37 — with GitHub Actions View deployment

docs(Channel): trim verbose comments added for the disconnect guards

0bb7fb7

Reduce the getChannelConfig JSDoc and the inline comments to the core statement: what throws, when, and what is returned instead.

oliverlaz deployed to Vite Example Public (Preview) August 6, 2026 08:02 — with GitHub Actions View deployment

oliverlaz deployed to Vite Example Development (Preview) August 6, 2026 08:02 — with GitHub Actions View deployment

oliverlaz deployed to Vite Example Public (Preview) August 6, 2026 09:20 — with GitHub Actions View deployment

oliverlaz deployed to Vite Example Development (Preview) August 6, 2026 09:20 — with GitHub Actions View deployment

oliverlaz deployed to Vite Example Public (Preview) August 6, 2026 09:27 — with GitHub Actions View deployment

oliverlaz deployed to Vite Example Development (Preview) August 6, 2026 09:27 — with GitHub Actions View deployment

oliverlaz merged commit f60273f into master Aug 6, 2026
13 checks passed

oliverlaz deleted the fix/disconnected-channel-getconfig branch August 6, 2026 10:20

Navigation Menu

Uh oh!

fix(Channel): guard render-phase channel.getConfig() against disconnected channels - #3257

fix(Channel): guard render-phase channel.getConfig() against disconnected channels#3257
oliverlaz merged 5 commits into
masterfrom
fix/disconnected-channel-getconfig

oliverlaz commented Aug 5, 2026 •

edited by coderabbitai Bot

Loading

Uh oh!

coderabbitai Bot commented Aug 5, 2026 •

edited

Loading

Reviews paused

Walkthrough

Changes

Uh oh!

github-actions Bot commented Aug 5, 2026 •

edited

Loading

Uh oh!

coderabbitai Bot left a comment

Uh oh!

Uh oh!

codecov Bot commented Aug 5, 2026 •

edited

Loading

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

oliverlaz commented Aug 5, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🎯 Goal

🛠 Implementation details

🎨 UI Changes

Summary by CodeRabbit

Uh oh!

coderabbitai Bot commented Aug 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Reviews paused

Walkthrough

Changes

Uh oh!

github-actions Bot commented Aug 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

codecov Bot commented Aug 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

oliverlaz commented Aug 5, 2026 •

edited by coderabbitai Bot

Loading

coderabbitai Bot commented Aug 5, 2026 •

edited

Loading

github-actions Bot commented Aug 5, 2026 •

edited

Loading

codecov Bot commented Aug 5, 2026 •

edited

Loading